import { defineConfig, globalIgnores } from 'eslint/config'
import globals from 'globals'
import js from '@eslint/js'
import pluginVue from 'eslint-plugin-vue'
import skipFormatting from '@vue/eslint-config-prettier/skip-formatting'

// 手动添加auto-import的全局变量
const autoImportGlobals = {
  Component: true,
  ComponentPublicInstance: true,
  ComputedRef: true,
  DirectiveBinding: true,
  EffectScope: true,
  ElMessage: true,
  ElMessageBox: true,
  ExtractDefaultPropTypes: true,
  ExtractPropTypes: true,
  ExtractPublicPropTypes: true,
  InjectionKey: true,
  MaybeRef: true,
  MaybeRefOrGetter: true,
  PropType: true,
  Ref: true,
  ShallowRef: true,
  Slot: true,
  Slots: true,
  VNode: true,
  WritableComputedRef: true,
  acceptHMRUpdate: true,
  computed: true,
  createApp: true,
  createPinia: true,
  customRef: true,
  defineAsyncComponent: true,
  defineComponent: true,
  defineStore: true,
  effectScope: true,
  getActivePinia: true,
  getCurrentInstance: true,
  getCurrentScope: true,
  getCurrentWatcher: true,
  h: true,
  inject: true,
  isProxy: true,
  isReactive: true,
  isReadonly: true,
  isRef: true,
  isShallow: true,
  mapActions: true,
  mapGetters: true,
  mapState: true,
  mapStores: true,
  mapWritableState: true,
  markRaw: true,
  nextTick: true,
  onActivated: true,
  onBeforeMount: true,
  onBeforeRouteLeave: true,
  onBeforeRouteUpdate: true,
  onBeforeUnmount: true,
  onBeforeUpdate: true,
  onDeactivated: true,
  onErrorCaptured: true,
  onMounted: true,
  onRenderTracked: true,
  onRenderTriggered: true,
  onServerPrefetch: true,
  onUnmounted: true,
  onUpdated: true,
  onWatcherCleanup: true,
  provide: true,
  reactive: true,
  readonly: true,
  ref: true,
  resolveComponent: true,
  setActivePinia: true,
  setMapStoreSuffix: true,
  shallowReactive: true,
  shallowReadonly: true,
  shallowRef: true,
  storeToRefs: true,
  toRaw: true,
  toRef: true,
  toRefs: true,
  toValue: true,
  triggerRef: true,
  unref: true,
  useAttrs: true,
  useCssModule: true,
  useCssVars: true,
  useId: true,
  useLink: true,
  useModel: true,
  useRoute: true,
  useRouter: true,
  useSlots: true,
  useTemplateRef: true,
  watch: true,
  watchEffect: true,
  watchPostEffect: true,
  watchSyncEffect: true,
}

export default defineConfig([
  {
    name: 'app/files-to-lint',
    files: ['**/*.{js,mjs,jsx,vue}'],
  },

  globalIgnores(['**/dist/**', '**/dist-ssr/**', '**/coverage/**']),

  {
    languageOptions: {
      globals: {
        ...globals.browser,
        ...autoImportGlobals,
      },
    },
  },

  js.configs.recommended,
  ...pluginVue.configs['flat/essential'],
  skipFormatting,
])
